$(function () {
  //获取id
  const id=window.parent.document.querySelector('iframe').getAttribute('data-id')
  //渲染文章分类列表
  initArtCateList()
  function initArtCateList() {
    axios.get('/my/article/cates').then(({data:res}) =>{
      console.log(res);
      let arr = [`<option value="">请选择文章类别</option>`]
      res.data.forEach(element=> {
        arr.push(`<option value="${element.Id}">${element.name}</option>`)
      });
      $('[name="cate_id"]').empty().html(arr.join(''))
      layui.form.render()
    })
  }
  //渲染文章
  initArticle()
  function initArticle() {
    axios.get(`/my/article/${id}`).then(res => {
      console.log(res);
      // form.val("formTest",res.data.data);
      $('[name="Id"]').val(id)
      $('[name="title"]').val(res.data.data.title)
      // $('[name="cate_id"]').val(res.data.data.id)
      //富文本赋值
      tinyMCE.activeEditor.setContent(res.data.data.content)
      // $('[name="content"]').val(res.data.data.content)
      $('[name="cate_id"]').find(`option:value('${res.data.data.id}')`).attr("selected", true);
      // $('[name="cate_id"]').val(res.data)
      let oldImgURL = URL.createObjectURL(res.data.data.cover_img)
      console.log(oldImgURL);
      $('#image').attr('src',res.data.data.cover_img)

    })
  }
  
  initEditor()
  // 1. 初始化图片裁剪器
  var $image = $('#image')
  
  // 2. 裁剪选项
  var options = {
    aspectRatio: 400 / 280,
    preview: '.img-preview'
  }
  
  // 3. 初始化裁剪区域
  $image.cropper(options)
  $('form').on('submit',function(e){
    e.preventDefault()
    let fd = new FormData(this)
    
    
    fd.append('state',state)
    // console.log(...fd);
    $image.cropper('getCroppedCanvas', { // 创建一个 Canvas 画布
      width: 400,
      height: 280
    })
    .toBlob(function(blob) {       // 将 Canvas 画布上的内容，转化为文件对象
      // 得到文件对象后，进行后续的操作
      fd.append('cover_img', blob)
      console.log(...fd);
      axios.post('/my/article/edit', fd).then(res => {
        if (res.data.status !== 0) {
          return layer.msg(res.data.message)
        }
        layer.msg('恭喜你,修改成功')
        setTimeout(function () {
          window.parent.document.querySelector('#art_list').click()
        console.log(res);
        },1000)
        
      })
    });
  })
  let state = ''
  $('#btn1').on('click', function () {
    // layui.form.verify({
      
    // })
    state = '已发布'
  })
  $('#btn2').on('click',function(){
    state = '草稿'
  })
  $('#chooseImageBtn').on('click',function(){
    $('#chooseImageIpt').click()
  })
  $('#chooseImageIpt').on('change',function(e){
    var file = e.target.files[0]
    if (file === undefined) {
      return
    }
    var newImgURL = URL.createObjectURL(file)
    $image
   .cropper('destroy')      // 销毁旧的裁剪区域
   .attr('src', newImgURL)  // 重新设置图片路径
      .cropper(options)        // 重新初始化裁剪区域
  })
})